﻿<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script type="text/javascript" src="../dhtiny.js"></script>
</head>
<body>
Select animation effect <select id="effect"></select><br />
<button onclick="run(200,100)">Go to position (200, 100)</button>
<button onclick="run(200,200)">Go to (200,200)</button>
<button onclick="run(100,100)">Back to (100,100)</button>
<script type="text/javascript">
$dh.Require(["ctrl/animitem"]);

var test , eff = "strongEaseOut"; // Default effect is strongEaseOut
$dh.addLoader(function() {
    createOptions();
    test = new DHAnimItem(document.body, {
        left: 100, top: 100, position: "absolute", zIndex: 100, width: 100, height: 100, background: "blue"
    });
    test.show();
});

function createOptions() {
    var s = document.getElementById("effect");
    for (var p in DHMotion.AnimEffects) {
        var op = document.createElement("option");
        op.value = p;
        op.innerHTML = p;
        s.appendChild(op);
    }
}

function run(L, T) {
    if (test.animation.actionStatus == "onrun") return;
    test.draw({ left: L, top: T }, 0.5,  DHMotion.AnimEffects[effect.value]);
}
</script>    
 </body>
</html>
